// 退出页面
var backBtn = document.querySelector(".backBtn");
backBtn.onclick = function () {
  if (confirm("确定退出登录吗？")) {
    window.location.href = "login.html";
  }
};

// 添加模块
var addBtn = document.getElementsByClassName("addBtn")[0];
addBtn.onclick = function add() {
  var trs = document.getElementsByTagName("tr");
  var firstTd;
  var mask = document.querySelector(".mask");
  var cancel = document.querySelector(".cancel");
  var addinfo = document.getElementById("addinfo");
  var addTo = document.getElementsByClassName("add")[0];
  var inputValue = addinfo.getElementsByTagName("input");
  for (var i = 0; i <= 4; i++) {
    inputValue[i].value = "";
  }
  cancel.onclick = function () {
    mask.style.display = "none";
  };
  mask.onclick = function (e) {
    if (e.target == mask) mask.style.display = "none";
  };
  mask.style.display = "flex";
  // 数据校验
  addTo.onclick = function () {
    var name = inputValue[1].value;
    var year = inputValue[2].value;
    var department = inputValue[3].value;
    var stuClass = inputValue[4].value;
    var stuId = inputValue[0].value;
    var idreg = /^[0-9]{6}$/;
    var namereg = /^[\u4e00-\u9fa5]{2,5}/;
    if (
      name == "" ||
      department == "" ||
      stuClass == "" ||
      stuId == "" ||
      year == ""
    ) {
      return alert("输入数据不能为空");
    }
    for (var i = 1; i < trs.length; i++) {
      firstTd = trs[i].cells[0].innerHTML;
      if (stuId == firstTd) {
        return alert("该学号已存在");
      }
    }
    if (namereg.test(name) == false) {
      return alert("姓名输入有误");
    }
    if (idreg.test(stuId) == false) {
      return alert("id输入有误! 请输入6位数整数");
    } else if (year > 2024 || year < 2018) {
      return alert("年份输入有误");
    } else if (confirm("是否添加？")) {
      mask.style.display = "none";
      var newStr = document.createElement("tr");
      newStr.innerHTML =
        "<td>" +
        stuId +
        "</td>" +
        "<td>" +
        name +
        "</td>" +
        "<td>" +
        year +
        "</td>" +
        "<td>" +
        department +
        "</td>" +
        "<td>" +
        stuClass +
        "</td>" +
        "<td>" +
        '<button type="button" class="remove" onclick="delRow(this)"><i class="iconfont">&#xe61c;</i></button>&nbsp<button type="button" class="edit" onclick="updateRow(this)" ><i class="iconfont">&#xe8cf;</i></button>' +
        "</td>";
      document.getElementsByTagName("tbody")[0].appendChild(newStr);
    }
  };
};
// 删除功能
// 声明删除行，父节点删除子节点
function delRow(btn) {
  // 获取table对象
  var table = document.getElementById("stu");
  // 获取要删除的行对象(按钮的父对象是td td的父对象是tr)
  var tr = btn.parentNode.parentNode;
  //删除行
  if (confirm("是否删除？")) {
    table.deleteRow(tr.rowIndex);
  }
}
// 查询模块
var searchBtn = document.getElementById("search");
searchBtn.onclick = function research() {
  //获取文本框内容
  var search = document.getElementsByClassName("search")[0];
  var inputValue = search.getElementsByTagName("input")[0];
  var data = inputValue.value;
  // 获取表格中的列
  var trs = document.getElementsByTagName("tr");
  var len = trs.length;
  // 数据校验
  if (data == "") {
    return alert("请输入数据");
  }
  //for循环遍历
  for (var i = 1; i < len; i++) {
    if (
      data == trs[i].cells[1].innerHTML ||
      data == trs[i].cells[0].innerHTML
    ) {
      for (var j = 1; j < len; j++) {
        trs[j].style.display = "none";
      }
      trs[0].style.display = "";
      trs[i].style.display = "";
      return;
    }
    if (i == len - 1) {
      alert("该数据不存在");
      search.getElementsByTagName("input")[0].value = "";
      return;
    }
  }
};
// 让背景框随列表长度的改变而改变
function background() {
  var trs = document.getElementsByTagName("tr");
  var info = document.getElementsByClassName("info")[0];
  var length = trs.length;
  info.style.height = 200 + length * 30 + "px";
  if (200 + length * 30 < 680) info.style.height = "680px";
}
background();

// 查询后的刷新功能
var fresh = document.querySelector(".fresh");
fresh.onclick = function refresh() {
  var trs = document.getElementsByTagName("tr");
  for (var i = 0; i < trs.length; i++) {
    trs[i].style.display = "";
  }
  document
    .getElementsByClassName("search")[0]
    .getElementsByTagName("input")[0].value = "";
};

// 修改功能
//获取单元格对象
function updateRow(obj) {
  var tr = obj.parentNode.parentNode;
  var thistd = obj.parentNode;
  var cells = tr.getElementsByTagName("td");
  for (var i = 0; i < cells.length - 1; i++) {
    cells[0].style.width = "186.54px";
    cells[1].style.width = "108.53px";
    cells[2].style.width = "211.25px";
    cells[3].style.width = "211.25px";
    cells[4].style.width = "108.53px";
    cells[5].style.width = "277.89px";
    cells[i].innerHTML =
      "<input type='text' value='" + cells[i].innerHTML + "'/>";
    thistd.innerHTML =
      '<button type="button" class="save"><i class="iconfont">&#xec09;</i></button>';
    //实现保存功能
    thistd.childNodes[0].onclick = function () {
      for (var i = 0; i < cells.length - 1; i++) {
        cells[i].innerHTML = cells[i].childNodes[0].value;
        thistd.innerHTML =
          '<button type="button" class="remove" onclick="delRow(this)"><i class="iconfont">&#xe61c;</i> </button> <button type="button" class="edit" onclick="updateRow(this)"><i class="iconfont">&#xe8cf;</i> </button>';
      }
    };
  }
}
